var app =angular.module('myApp');
app.controller('f-sajiao',["$css","$http","$scope","$rootScope",function ($css,$http,$scope,$rootScope) {
    $css.add("./clothes/css/sajiao.css");
    $http.get('./data/sajiao1.json').success(function(data){
        console.log(data);
        $scope.data = data.data;
        // console.log($scope.data[1].data);
        $(function(){
            var $wrap = $('.f-wrap');
            var $middle = $('#f-middle');
            var $divs = $('#f-middle>div');
            //console.log($divs.length);
            var $spans = $('#f-wrap1>span');
            var $w = $wrap.width();
            $middle.css('width', $w * $divs.length);
            //console.log($middle.width());
            var $index = 0;
            var timer = setInterval($nextFn, 2000);
            function $nextFn() {
                $index++;
                if ($index > $divs.length - 1) {
                    $index = 0;
                }
                $middle.css("left", $index * $w * -1);
                $spans.eq($index).css('backgroundColor', '#fff').siblings().css('backgroundColor', 'transparent');
            }
            function $lastFn() {
                $index--;
                if ($index < 0) {
                    $index = $divs.length - 1;
                }
                $middle.css("left", $index * $w * -1);
                $spans.eq($index).css('backgroundColor', '#fff').siblings().css('backgroundColor', 'transparent');
            }
            var startX, endX;
            $wrap[0].addEventListener('touchstart', function (e) {
                var touch = e.targetTouches[0];
                startX = touch.pageX;
            });
            $wrap[0].addEventListener('touchmove', function (e) {
                var touch = e.targetTouches[0];
                endX = touch.pageX;
                clearInterval(timer);
            })
            $wrap[0].addEventListener('touchend', function (e) {
                if (endX - startX > 100) {
                    $lastFn();
                    $clearTimer();
                } else if (endX - startX < -100) {
                    $nextFn();
                    $clearTimer();
                }
                    $clearTimer();

            })
            function $clearTimer() {
                clearInterval(timer);
                timer = setInterval($nextFn, 2000);
            }
        })
    })
}])
